<!--
    group: user
    name: 企业入驻
    url: /user/settledEnterprise
-->
<template>
  <div class="main_content-app">
  <!-- <a-steps progress-dot :current="currentTab" size="small" @change="onChange"> -->
     <a-steps progress-dot :current="currentTab" size="small">
      <a-step v-for="item in steps" :key="item.key" :title="item.title" />
    </a-steps>
    <a-divider />
    <div class="content">
      <LegalSettled v-if="currentTab === 0" :updateFormData="updateFormData" :channelId="channelId" @nextStep="nextStep" />
      <EnterpriseSettled v-if="currentTab === 1" :formData="formData" :channelId="channelId" :undertakeData="undertakeData" @nextStep="nextStep" @prevStep="prevStep" @passStep="passStep" />
<!--      <AttestationSettled v-if="currentTab === 2" :channelId="channelId" :undertakeData="undertakeData" @nextStep="nextStep" @prevStep="prevStep" />-->
      <SignSettled v-if="currentTab === 2" @nextStep="nextStep" :undertakeData="undertakeData" @prevStep="prevStep" />
      <CompleteSettled v-if="currentTab === 3" @prevStep="prevStep" @finish="finish" />
    </div>
    <div class='mask' v-if='isWeiXinMb' @touchmove.stop.prevent><img class='img' src='//zxcloud.oss-cn-hangzhou.aliyuncs.com/user/files/%E7%82%B9%E5%87%BB%E5%8F%B3%E4%B8%8A%E8%A7%92%E9%80%89%E6%8B%A9%E6%B5%8F%E8%A7%88%E5%99%A8%E6%89%93%E5%BC%80.png' alt=''></div>
  </div>
</template>

<script>
import '@/utils/rem'  //rem
import '@/assets/css/enterprise.less'  //css
import LegalSettled from './settleIn/legalSettled'
import EnterpriseSettled from './settleIn/enterpriseSettled'
import AttestationSettled from './settleIn/attestationSettled'
import SignSettled from './settleIn/signSettled'
import CompleteSettled from './settleIn/completeSettled'
import  { carriedParameters } from '@/utils/util'
export default {
  name: 'settledEnterprise',
  data() {
    return {
      currentTab: 0,
      steps: [
        {
          key: 0,
          title: '个人信息',
        },
        {
          key: 1,
          title: '企业信息',
        },
        // {
        //   key: 2,
        //   title: '身份认证',
        // },
        {
          key: 2,
          title: '签署协议',
        },
        {
          key: 3,
          title: '注册完成',
        },
      ],
      steps1: [
        {
          key: 0,
          title: '个人信息',
        },
        {
          key: 1,
          title: '企业信息',
        },
        {
          key: 3,
          title: '注册完成',
        },
      ],
      isWeiXinMb:false,
      channelId: null,   //渠道id密文
      undertakeData: {},    //请求返回id和token

      protocolType: null,   //企业所属合作模式
      formData:{}, // 用于共享数据
    };
  },
  components:{
    LegalSettled,
    EnterpriseSettled,
    AttestationSettled,
    SignSettled,
    CompleteSettled
  },
  created() {
    this.channelId = carriedParameters(window.location.href,'channelIdEncrept');  //渠道id密文
    this.protocolType = carriedParameters(window.location.href,'protocolType');    //企业所属合作模式
    //合作模式   总包不签署协议 分包签署协议    1-总包  2-分包
    if (this.protocolType == 1){
      this.steps = this.steps1;
    }
    let page = carriedParameters(window.location.href,'pagetab');  //跳转到指定tab
    if (page){
      this.currentTab = parseInt(page);
    }else {
      this.currentTab = 0;
    }
  },
  mounted() {
    if (this.isWeiXin()) {
      // alert(" 是来自微信内置浏览器")
      this.isWeiXinMb = true;

    } else {
      // alert("不是来自微信内置浏览器")
      this.isWeiXinMb = false;

    }
  },
  methods: {
    updateFormData(form_){
      this.formData = {...this.formData,...form_};
    },
    //下一步
    nextStep(data) {
      if (data){
        this.undertakeData = data;
      }
      if (this.currentTab < 4) {
        this.currentTab += 1;
      }
    },
    //上一步
    prevStep() {
      if (this.currentTab > 0) {
        this.currentTab -= 1;
      }
    },
    //根据合作模式跳转
    passStep(){
      this.currentTab = 3;
    },
    //完成
    finish() {
      this.currentTab = 0;
    },
    onChange(currentTab) {
      this.currentTab = currentTab;
    },
    isWeiXin() {
      var ua = window.navigator.userAgent.toLowerCase();
      if (ua.match(/MicroMessenger/i) == 'micromessenger') {
        return true;
      } else {
        return false;
      }
    }
  },
}
</script>

<style scoped lang="less">
.main_content{
  width: 100%;
  //padding: 30px 292px;
}
.mask{
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #000000a8;
  z-index: 10;
}
.img{
  position: absolute;
  width: 80%;
  top: 20px;
  right: 20px;
  max-width: 550px;
}
/deep/.ant-steps-item-title{
  font-size: .06rem;
}
/deep/.ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title{
  color: @color-blue;
}
/deep/.ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title{
  color: @color-blue;
}
</style>
